{#
 This Source Code Form is subject to the terms of the Mozilla Public
 License, v. 2.0. If a copy of the MPL was not distributed with this
 file, You can obtain one at https://mozilla.org/MPL/2.0/.
#}

{% from "macros-protocol.html" import callout with context %}

{% extends "firefox/welcome/base.html" %}

{% block page_title %}{{ ftl('welcome-page8-firefox-protects-your-privacy') }}{% endblock %}

{% set _utm_content = 'none' %}
{% set _utm_campaign = 'welcome-8-protection' %}
{% set _utm_source = 'mozilla.org-firefox-welcome-8' %}

{% block body_class %}{{ super() }} welcome-page8{% endblock %}

{%block page_css %}
 {{ super()}}
 {{ css_bundle('protocol-callout') }}
{% endblock %}

{% block content_intro %}
  {% call callout(
      title=ftl('welcome-page8-your-privacy-respected'),
      desc=ftl('welcome-page8-firefox-automatically-protects'),
      class='mzp-t-firefox mzp-t-dark mzp-t-hero variation-default',
      include_cta=True,
      heading_level=1
    ) %}
    <p class="primary-cta protection-report">
      <a href="https://support.mozilla.org/kb/enhanced-tracking-protection-firefox-desktop/?utm_source={{ _utm_source }}&utm_medium=referral&utm_campaign={{ _utm_campaign }}&utm_content={{_utm_content}}" class="mzp-c-button mzp-t-product" id="button" rel="external" data-cta-position="primary" data-cta-text="View your report">
        {{ ftl('welcome-page8-view-your-protection-report') }}
      </a>
    </p>
  {% endcall %}
{% endblock %}

{% block content_primary %}
  <div class="body-primary">
    <div class="c-picto-block t-adjacent-image">
      <div class="c-picto-block-image">
        <img class="c-emphasis-box-logo" src="{{ static('img/icons/tracking-protection.svg') }}" width="48px" alt="">
      </div>

      <h3 class="c-picto-block-title">{{ ftl('welcome-page8-enhanced-tracking-protection') }}</h3>
      <div class="c-picto-block-body">
        <p>{{ ftl('welcome-page8-automatically-block-sites') }}</p>
        <a class="protection-report" href="https://support.mozilla.org/kb/enhanced-tracking-protection-firefox-desktop/?utm_source={{ _utm_source }}&utm_medium=referral&utm_campaign={{ _utm_campaign }}&utm_content={{_utm_content}}" data-cta-position="secondary" data-cta-text="See what’s blocked" >
          <strong>{{ ftl('welcome-page8-see-whats-blocked') }}</strong>
        </a>
      </div>
    </div>

    <div class="c-picto-block t-adjacent-image">
      <div class="c-picto-block-image">
        <img src="{{ static('protocol/img/logos/firefox/monitor/logo.svg') }}" width="48px" alt="">
      </div>
      <h3 class="c-picto-block-title">
        {{ ftl('welcome-page8-mozilla-monitor') }}
      </h3>
      <div class="c-picto-block-body">
      {% if LANG == "en-US" %}
        <p>See if your personal info has been exposed in a data breach. We’ll automatically remove it from sites selling it and continuously monitor your identity for future leaks.</p>
        <a id="monitor-link" href="https://monitor.mozilla.org/?utm_source={{ _utm_source }}&utm_medium=referral&utm_campaign={{ _utm_campaign }}&utm_content={{_utm_content}}" data-cta-text="go to monitor" >
          <strong>Check for breaches now</strong>
        </a>
      {% else %}
        <p>{{ ftl('welcome-page8-see-what-youve-been') }}</p>
        <a id="monitor-link" href="https://monitor.mozilla.org/?utm_source={{ _utm_source }}&utm_medium=referral&utm_campaign={{ _utm_campaign }}&utm_content={{_utm_content}}" data-cta-text="go to monitor" >
          <strong>{{ ftl('welcome-page8-go-to-monitor') }}</strong>
        </a>
      {% endif %}
      </div>
    </div>

    {% if LANG != 'zh-CN' %}
      <div class="c-picto-block t-adjacent-image">
        <div class="c-picto-block-image">
          <img src="{{ static('img/logos/fbcontainer/logo-fbcontainer.svg') }}" width="48px" alt="">
        </div>
        <h3 class="c-picto-block-title">{{ ftl('welcome-page8-facebook-container') }}</h3>
        <div class="c-picto-block-body">
          <p>{{ ftl('welcome-page8-stay-connected') }}</p>
          <a id="fb-container-link" href="https://addons.mozilla.org/firefox/addon/facebook-container/?src=mozilla.org-welcome-8-hvt&utm_source={{ _utm_source }}&utm_medium=referral&utm_campaign={{ _utm_campaign }}&utm_content={{_utm_content}}"data-cta-text="go to fb container"  >
            <strong>{{ ftl('welcome-page8-add-facebook-container') }}</strong>
          </a>
        </div>
      </div>
    {% endif %}

  </div>
{% endblock %}


{% block content_utility %}
<p>
  <strong>
    <a href="https://support.mozilla.org/kb/firefox-browser-welcome-pages/?utm_source={{ _utm_source }}&utm_medium=referral&utm_campaign={{ _utm_campaign }}&entrypoint={{ _utm_source }}">
      {{ ftl('welcome-page8-why-am-i') }}
    </a>
  </strong>
</p>
{% endblock %}

{% block js %}
  {{ js_bundle('firefox_welcome_page8') }}
{% endblock %}
